
function getUrlSearch(name) {
    // 未传参，返回空
    if (!name) return null;
    // 查询参数：先通过search取值，如果取不到就通过hash来取
    var after = window.location.search;
    after = after.substr(1) || window.location.hash.split('?')[1];
    // 地址栏URL没有查询参数，返回空
    if (!after) return null;
    // 如果查询参数中没有"name"，返回空
    if (after.indexOf(name) === -1) return null;

    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
    // 当地址栏参数存在中文时，需要解码，不然会乱码
    var r = decodeURI(after).match(reg);
    // 如果url中"name"没有值，返回空
    if (!r) return null;

    return r[2];
}
const id=getUrlSearch('id');
var sock = new SockJS("http://localhost:8081/socket");
var stompClient = Stomp.over(sock);
var friends = new Array()
var myPicture
var myName
var addFriendList = new Array()
var buildGroupList = new Array()
var GroupList = new Array()

// $(document).ready(function () {
//
//
// });

function getFormatDate(){
    var nowDate = new Date();
    var hour = nowDate.getHours()< 10 ? "0" + nowDate.getHours() : nowDate.getHours();
    var minute = nowDate.getMinutes()< 10 ? "0" + nowDate.getMinutes() : nowDate.getMinutes();
    var second = nowDate.getSeconds()< 10 ? "0" + nowDate.getSeconds() : nowDate.getSeconds();
    return hour+":"+minute+":"+second;
}

function myInfor(){
    $.post("http://localhost:8081/myinfor",{userId:id},function(data){
        console.log(data);
        myPicture=data[0].picture;
        myName=data[0].userName;
        $("#avaer").attr("src", myPicture);
    });
}

function friendsLit(){
    $.post("http://localhost:8081/message/friends",{userId:id},function(data){
        console.log(data);
        friends=JSON.parse(JSON.stringify(data));

        for(let i=0;i<friends.length;i++){
            $("#firendlist").append('<a href="#sendmessagepage'+friends[i].friendId+'" data-role="button" class="ui-btn" data-transition="slide" style="width: 100%;margin: 0;padding-top:5px;padding-bottom:5px;padding-left:7px;height: 8%; border-bottom:1px solid #e6e6e6;background-color: white;display: flex;flex-direction: row">\n'+
                '<img src="'+friends[i].picture+'" style="width: 11.3%;height: 100%;margin: 0;border-radius: 5px;">\n'+
                '<div class="message-part" style="width: 83%;height: 100%;margin-left: 2%;display: flex;flex-direction: row;flex-wrap: wrap">\n'+
                '<text class="friendsName1" style="width: 85%;height: 50%;text-align:left;font-family: 宋体">'+friends[i].friendName+'</text>\n'+
                '<text class="time'+friends[i].friendId+'" style="width: 15%;height: 50%;font-size: 10px;color: #b5bbbf"></text>\n'+
                '<text class="messageContent'+friends[i].friendId+'" style="width: 100%;height: 50%;padding-top:1.2%;text-align:left;font-family: 黑体;font-size: 16px;color: #aab0b4;font-weight: 200;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">暂无消息</text>\n'+
                '</div>\n'+
                '</a>');
            $(".main-body").append('<div data-role="page" id="sendmessagepage'+friends[i].friendId+'">\n'+
                '<div data-role="header" data-position="fixed" style="background-color: #e6e6e6;height: 6.6%;border-width:0">\n'+
                '<a href="#firstpage" class="ui-btn" data-transition="slide" data-direction="reverse" style="width: 6.5%; background-color: #e6e6e6;height: 66.32%;padding: 0;margin-top: 1%;border: 0"><img\n'+
            'src="/static/img/back.png"\n'+
            'style="width: 100%;height: 100%;margin: 0"></a>\n'+
                '<h1 style="font-size: 20px;margin-top: -1%;font-family: 宋体">'+friends[i].friendName+'</h1>\n'+
                '</div>\n'+
                '<div data-role="main" id="message-content'+friends[i].friendId+'" class="ui-content" style="padding-top:0;padding-bottom:0;padding-left: 2%;padding-right: 2% ">\n'+
               ' </div>\n'+
                '<div data-role="footer" data-position="fixed" style="display: flex; align-items: center;justify-content: space-around">\n'+
                '<div class="ui-content" style="padding: 0;margin-left: 2%;background-color: rgba(242,250,255,0);width: 80%;margin-right: 0;margin-top: 0;margin-bottom:0;border: 0;border-color: rgba(242,250,255,0)">\n'+
                '<input type="text" id="messagecontent'+friends[i].friendId+'" style="margin: 0;padding: 0;width: 100%">\n'+
               ' </div>\n'+
                '<div style="width: 12%;height:30px">\n'+
                '<button class="btn-send" id="'+friends[i].friendId+'" onclick="sendClick(this.id)" style="height: 100%;width: 100%;margin: 0;padding: 0">发 送</button>\n'+
            '</div>\n'+
            '</div>\n'+
            '</div>');
            $("#chooseFriends").append('<option value="'+friends[i].friendId+'">'+friends[i].friendName+'</option>')
        }
        $("#chooseFriends").selectedIndex = friends.length;
        $("#chooseFriends").selectmenu('refresh');
    });
}

function buildgroupList() {
    $.post("http://localhost:8081/buildlist",{userId:id},function (data) {
        console.log(data);
        buildGroupList=JSON.parse(JSON.stringify(data));

        for(let i=0;i<buildGroupList.length;i++){
            $(".remind").css({
                "background-color": "red",
            });
            $("#remind-content").append('<div class="remind-contentg'+buildGroupList[i].groupId+'" style="display: flex;flex-direction: row;align-items: center">'+
                '<div style="width: 60%">'+
                '<h4>'+buildGroupList[i].senderName+'邀请加入群聊</h4>'+
                '</div>'+
                '<div style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 40%">'+
                '<a data-role="button" id="accessInvite'+buildGroupList[i].groupId+'" onclick="accessInviteClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">接受</a>'+
                '<a data-role="button" id="refuseInvite'+buildGroupList[i].groupId+'" onclick="refuseInviteClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">拒绝</a>'+
                '</div>'+
                '</div>');
        }
    })
}

function groupList() {
    $.post("http://localhost:8081/grouplist",{userId:id},function (data) {
        GroupList=JSON.parse(JSON.stringify(data));

        for(let i=0;i<GroupList.length;i++){
            $("#firendlist").append('<a href="#sendmessagepageg'+GroupList[i].groupId+'" data-role="button" class="ui-btn" data-transition="slide" style="width: 100%;margin: 0;padding-top:5px;padding-bottom:5px;padding-left:7px;height: 8%; border-bottom:1px solid #e6e6e6;background-color: white;display: flex;flex-direction: row">\n'+
                '<img src="'+GroupList[i].groupPicture+'" style="width: 11.3%;height: 100%;margin: 0;border-radius: 5px;">\n'+
                '<div class="message-part" style="width: 83%;height: 100%;margin-left: 2%;display: flex;flex-direction: row;flex-wrap: wrap">\n'+
                '<text class="friendsName1" style="width: 85%;height: 50%;text-align:left;font-family: 宋体">'+GroupList[i].groupName+'</text>\n'+
                '<text class="timeg'+GroupList[i].groupId+'" style="width: 15%;height: 50%;font-size: 10px;color: #b5bbbf"></text>\n'+
                '<text class="messageContentg'+GroupList[i].groupId+'" style="width: 100%;height: 50%;padding-top:1.2%;text-align:left;font-family: 黑体;font-size: 16px;color: #aab0b4;font-weight: 200;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">暂无消息</text>\n'+
                '</div>\n'+
                '</a>');
            $(".main-body").append('<div data-role="page" id="sendmessagepageg'+GroupList[i].groupId+'">\n'+
                '<div data-role="header" data-position="fixed" style="background-color: #e6e6e6;height: 6.6%;border-width:0">\n'+
                '<a href="#firstpage" class="ui-btn" data-transition="slide" data-direction="reverse" style="width: 6.5%; background-color: #e6e6e6;height: 66.32%;padding: 0;margin-top: 1%;border: 0"><img\n'+
                'src="/static/img/back.png"\n'+
                'style="width: 100%;height: 100%;margin: 0"></a>\n'+
                '<h1 style="font-size: 20px;margin-top: -1%;font-family: 宋体">'+GroupList[i].groupName+'</h1>\n'+
                '</div>\n'+
                '<div data-role="main" id="message-contentg'+GroupList[i].groupId+'" class="ui-content" style="padding-top:0;padding-bottom:0;padding-left: 2%;padding-right: 2% ">\n'+
                ' </div>\n'+
                '<div data-role="footer" data-position="fixed" style="display: flex; align-items: center;justify-content: space-around">\n'+
                '<div class="ui-content" style="padding: 0;margin-left: 2%;background-color: rgba(242,250,255,0);width: 80%;margin-right: 0;margin-top: 0;margin-bottom:0;border: 0;border-color: rgba(242,250,255,0)">\n'+
                '<input type="text" id="messagecontentg'+GroupList[i].groupId+'" style="margin: 0;padding: 0;width: 100%">\n'+
                ' </div>\n'+
                '<div style="width: 12%;height:30px">\n'+
                '<button class="btn-send" id="g'+GroupList[i].groupId+'" onclick="sendClick(this.id)" style="height: 100%;width: 100%;margin: 0;padding: 0">发 送</button>\n'+
                '</div>\n'+
                '</div>\n'+
                '</div>');
        }
    })

}

myInfor();
friendsLit();
buildgroupList();
groupList();


stompClient.connect({},function (frame) {
    console.log('connect:'+frame);
    stompClient.subscribe("/user/"+id+"/message/get",function (response) {
        var message = JSON.parse(response.body);
        console.log(message);
        if(message.messageType==="sendmessage"){
            if (message.toUserId === Number(id)) {

                $("#message-content" + message.fromUserId).append('<div style="width: 100%; height: auto;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 2%">\n' +
                    '                            <img src='+ friends[friends.findIndex(x => x.friendId === message.fromUserId)].picture+' style="width: 10%;height: 10%;border-radius: 50%;margin-top: 2%">\n' +
                    '                            <textarea  readonly="readonly" style="width: 70%;margin-right: 17%;margin-top:3%;border-radius: 5px" class="ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow">' + message.content + '</textarea>\n' +
                    '                        </div>');
                $(".messageContent"+ message.fromUserId).text(message.content);
                $(".time"+ message.fromUserId).text(message.time)
            } else if(message.fromUserId===Number(id)){

                $("#message-content"+message.toUserId).append('<div style="width: 100%; height: auto;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 2%">\n' +
                    '                            <textarea  readonly="readonly" style="width: 70%;margin-left: 17%;margin-top:3%;border-radius: 5px" class="ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow">' + message.content + '</textarea>\n' +
                    '                            <img src='+myPicture+' style="width: 10%;height: 10%;border-radius: 50%;margin-top: 2%">\n' +
                    '                        </div>');
                $(".messageContent"+ message.toUserId).text(message.content)
                $(".time"+ message.toUserId).text(message.time)
            }
        }else if(message.messageType==="addfriends"){
            $(".remind").css({
                "background-color": "red",
            });
            $("#remind-content").append('<div class="remind-content'+message.fromUserId+'" style="display: flex;flex-direction: row;align-items: center">'+
                '<div style="width: 60%">'+
                '<h4>'+message.userName+'好友请求</h4>'+
                '</div>'+
                '<div style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 40%">'+
                '<a data-role="button" id="access'+message.fromUserId+'" onclick="accessClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">接受</a>'+
                '<a data-role="button" id="refuse'+message.fromUserId+'" onclick="refuseClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">拒绝</a>'+
                '</div>'+
                '</div>');
            console.log(message.userName+"请求添加好友")
        }else if(message.messageType ==="access"){
            $("#firendlist").append('<a href="#sendmessagepage'+message.fromUserId+'" data-role="button" class="ui-btn" data-transition="slide" style="width: 100%;margin: 0;padding-top:5px;padding-bottom:5px;padding-left:7px;height: 8%; border-bottom:1px solid #e6e6e6;background-color: white;display: flex;flex-direction: row">\n'+
                '<img src="'+message.content+'" style="width: 11.3%;height: 100%;margin: 0;border-radius: 5px;">\n'+
                '<div class="message-part" style="width: 83%;height: 100%;margin-left: 2%;display: flex;flex-direction: row;flex-wrap: wrap">\n'+
                '<text class="friendsName1" style="width: 85%;height: 50%;text-align:left;font-family: 宋体">'+message.userName+'</text>\n'+
                '<text class="time'+message.fromUserId+'" style="width: 15%;height: 50%;font-size: 10px;color: #b5bbbf"></text>\n'+
                '<text class="messageContent'+message.fromUserId+'" style="width: 100%;height: 50%;padding-top:1.2%;text-align:left;font-family: 黑体;font-size: 16px;color: #aab0b4;font-weight: 200;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">暂无消息</text>\n'+
                '</div>\n'+
                '</a>');
            $(".main-body").append('<div data-role="page" id="sendmessagepage'+message.fromUserId+'">\n'+
                '<div data-role="header" data-position="fixed" style="background-color: #e6e6e6;height: 6.6%;border-width:0">\n'+
                '<a href="#firstpage" class="ui-btn" data-transition="slide" data-direction="reverse" style="width: 6.5%; background-color: #e6e6e6;height: 66.32%;padding: 0;margin-top: 1%;border: 0"><img\n'+
                'src="/static/img/back.png"\n'+
                'style="width: 100%;height: 100%;margin: 0"></a>\n'+
                '<h1 style="font-size: 20px;margin-top: -1%;font-family: 宋体">'+message.userName+'</h1>\n'+
                '</div>\n'+
                '<div data-role="main" id="message-content'+message.fromUserId+'" class="ui-content" style="padding-top:0;padding-bottom:0;padding-left: 2%;padding-right: 2% ">\n'+
                ' </div>\n'+
                '<div data-role="footer" data-position="fixed" style="display: flex; align-items: center;justify-content: space-around">\n'+
                '<div class="ui-content" style="padding: 0;margin-left: 2%;background-color: rgba(242,250,255,0);width: 80%;margin-right: 0;margin-top: 0;margin-bottom:0;border: 0;border-color: rgba(242,250,255,0)">\n'+
                '<input type="text" id="messagecontent'+message.fromUserId+'" style="margin: 0;padding: 0;width: 100%">\n'+
                ' </div>\n'+
                '<div style="width: 12%;height:30px">\n'+
                '<button class="btn-send" id="'+message.fromUserId+'" onclick="sendClick(this.id)" style="height: 100%;width: 100%;margin: 0;padding: 0">发 送</button>\n'+
                '</div>\n'+
                '</div>\n'+
                '</div>');

            var newFriend = {friendId:message.fromUserId,friendName:message.userName,picture:message.content};
            friends.push(newFriend)
        }else if(message.messageType === "refuse"){
            $(".remind").css({
                "background-color": "red",
            });
            $("#remind-content").append('<div class="remind-content'+message.fromUserId+'" style="display: flex;flex-direction: row;align-items: center">'+
                '<div style="width: 60%">'+
                '<h4>'+message.userName+'拒绝你的请求</h4>'+
                '</div>'+
                '<a data-role="button" id="determine'+message.fromUserId+'" onclick="determine(this.id)" style="padding:2px 4px 2px 4px;margin: 0 10% 0 0">确定</a>'+
                '</div>')
        }else if(message.messageType === "buildgroup"){
            $(".remind").css({
                "background-color": "red",
            });
            $("#remind-content").append('<div class="remind-contentg'+Number(message.content)+'" style="display: flex;flex-direction: row;align-items: center">'+
                '<div style="width: 60%">'+
                '<h4>'+message.userName+'邀请加入群聊</h4>'+
                '</div>'+
                '<div style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 40%">'+
                '<a data-role="button" id="accessInvite'+Number(message.content)+'" onclick="accessInviteClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">接受</a>'+
                '<a data-role="button" id="refuseInvite'+Number(message.content)+'" onclick="refuseInviteClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">拒绝</a>'+
                '</div>'+
                '</div>');
            console.log(message.userName+"邀请加入群聊")
        }else if(message.messageType === "accessgroup"){
            $("#firendlist").append('<a href="#sendmessagepageg'+message.fromUserId+'" data-role="button" class="ui-btn" data-transition="slide" style="width: 100%;margin: 0;padding-top:5px;padding-bottom:5px;padding-left:7px;height: 8%; border-bottom:1px solid #e6e6e6;background-color: white;display: flex;flex-direction: row">\n'+
                '<img src="'+message.content+'" style="width: 11.3%;height: 100%;margin: 0;border-radius: 5px;">\n'+
                '<div class="message-part" style="width: 83%;height: 100%;margin-left: 2%;display: flex;flex-direction: row;flex-wrap: wrap">\n'+
                '<text class="friendsName1" style="width: 85%;height: 50%;text-align:left;font-family: 宋体">'+message.userName+'</text>\n'+
                '<text class="timeg'+message.fromUserId+'" style="width: 15%;height: 50%;font-size: 10px;color: #b5bbbf"></text>\n'+
                '<text class="messageContentg'+message.fromUserId+'" style="width: 100%;height: 50%;padding-top:1.2%;text-align:left;font-family: 黑体;font-size: 16px;color: #aab0b4;font-weight: 200;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">暂无消息</text>\n'+
                '</div>\n'+
                '</a>');
            $(".main-body").append('<div data-role="page" id="sendmessagepageg'+message.fromUserId+'">\n'+
                '<div data-role="header" data-position="fixed" style="background-color: #e6e6e6;height: 6.6%;border-width:0">\n'+
                '<a href="#firstpage" class="ui-btn" data-transition="slide" data-direction="reverse" style="width: 6.5%; background-color: #e6e6e6;height: 66.32%;padding: 0;margin-top: 1%;border: 0"><img\n'+
                'src="/static/img/back.png"\n'+
                'style="width: 100%;height: 100%;margin: 0"></a>\n'+
                '<h1 style="font-size: 20px;margin-top: -1%;font-family: 宋体">'+message.userName+'</h1>\n'+
                '</div>\n'+
                '<div data-role="main" id="message-contentg'+message.fromUserId+'" class="ui-content" style="padding-top:0;padding-bottom:0;padding-left: 2%;padding-right: 2% ">\n'+
                ' </div>\n'+
                '<div data-role="footer" data-position="fixed" style="display: flex; align-items: center;justify-content: space-around">\n'+
                '<div class="ui-content" style="padding: 0;margin-left: 2%;background-color: rgba(242,250,255,0);width: 80%;margin-right: 0;margin-top: 0;margin-bottom:0;border: 0;border-color: rgba(242,250,255,0)">\n'+
                '<input type="text" id="messagecontentg'+message.fromUserId+'" style="margin: 0;padding: 0;width: 100%">\n'+
                ' </div>\n'+
                '<div style="width: 12%;height:30px">\n'+
                '<button class="btn-send" id="g'+message.fromUserId+'" onclick="sendClick(this.id)" style="height: 100%;width: 100%;margin: 0;padding: 0">发 送</button>\n'+
                '</div>\n'+
                '</div>\n'+
                '</div>');

        }else if(message.messageType==="sendgroupmessage"){
            if(message.fromUserId===Number(id)){

                $("#message-contentg"+message.toUserId).append('<div style="width: 100%; height: auto;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 2%">\n' +
                    '                            <textarea  readonly="readonly" style="width: 70%;margin-left: 17%;margin-top:3%;border-radius: 5px" class="ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow">' + message.content + '</textarea>\n' +
                    '                            <img src='+myPicture+' style="width: 10%;height: 10%;border-radius: 50%;margin-top: 2%">\n' +
                    '                        </div>');
                $(".messageContentg"+ message.toUserId).text(message.content)
                $(".timeg"+ message.toUserId).text(message.time)
            }else {
                var thePicture;
                if(friends.forEach(item=>{
                    if(item.friendId===message.fromUserId){
                        return true;
                    }else{
                        return false;
                    }
                })){
                    thePicture = friends[friends.findIndex(x => x.friendId === message.fromUserId)].picture
                    $("#message-contentg" + message.toUserId).append('<div style="width: 100%; height: auto;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 2%">\n' +
                        '                            <img src='+ thePicture+' style="width: 10%;height: 10%;border-radius: 50%;margin-top: 2%">\n' +
                        '                            <textarea  readonly="readonly" style="width: 70%;margin-right: 17%;margin-top:3%;border-radius: 5px" class="ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow">' + message.content + '</textarea>\n' +
                        '                        </div>');
                    $(".messageContentg"+ message.toUserId).text(message.content);
                    $(".timeg"+ message.toUserId).text(message.time)
                }else{
                    $.post("http://localhost:8081/userinfor",{userId:message.fromUserId},function (data) {
                        thePicture = data
                        $("#message-contentg" + message.toUserId).append('<div style="width: 100%; height: auto;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 2%">\n' +
                            '                            <img src='+ thePicture+' style="width: 10%;height: 10%;border-radius: 50%;margin-top: 2%">\n' +
                            '                            <textarea  readonly="readonly" style="width: 70%;margin-right: 17%;margin-top:3%;border-radius: 5px" class="ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow">' + message.content + '</textarea>\n' +
                            '                        </div>');
                        $(".messageContentg"+ message.toUserId).text(message.content);
                        $(".timeg"+ message.toUserId).text(message.time)
                    })
                }

            }
        }else if(message.messageType === "refuseinvite"){
            $(".remind").css({
                "background-color": "red",
            });
            $("#remind-content").append('<div class="remind-content'+message.fromUserId+'" style="display: flex;flex-direction: row;align-items: center">'+
                '<div style="width: 60%">'+
                '<h4>'+message.userName+'拒绝你的邀请</h4>'+
                '</div>'+
                '<a data-role="button" id="determine'+message.fromUserId+'" onclick="determine(this.id)" style="padding:2px 4px 2px 4px;margin: 0 10% 0 0">确定</a>'+
                '</div>')
        }

    })
});


setTimeout(function() { $.get("http://localhost:8081/message/history1",{id:id},function(data){
    console.log(data)
}); }, 1000);

setTimeout(function() { $.post("http://localhost:8081/addlist",{userId:id},function(data){
    console.log(data);
    addFriendList = JSON.parse(JSON.stringify(data));
    if(addFriendList.length !== 0){
        $(".remind").css({
            "background-color": "red",
        });
    }
    for(let j=0;j<addFriendList.length;j++){

        $("#remind-content").append('<div class="remind-content'+addFriendList[j].senderId+'" style="display: flex;flex-direction: row;align-items: center">'+
            '<div style="width: 60%">'+
            '<h4>'+addFriendList[j].senderName+'好友请求</h4>'+
            '</div>'+
            '<div style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 40%">'+
            '<a data-role="button" id="access'+addFriendList[j].senderId+'" onclick="accessClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">接受</a>'+
            '<a data-role="button" id="refuse'+addFriendList[j].senderId+'" onclick="refuseClick(this.id)" style="padding:2px 4px 2px 4px;margin: 0">拒绝</a>'+
            '</div>'+
            '</div>')
    }
}); }, 1000);


function sendClick(theId) {

    let content;
    if(theId.substring(0,1)==="g"){
        console.log("this");
        theId = theId.substring(1);
        $("#message-contentg"+theId).append('<div style="width: 100%; height: auto;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 2%">\n' +
            '                            <textarea  readonly="readonly" style="width: 70%;margin-left: 17%;margin-top:3%;border-radius: 5px" class="ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow">'+$("#messagecontentg"+theId).val()+'</textarea>\n' +
            '                            <img src='+myPicture+' style="width: 10%;height: 10%;border-radius: 50%;margin-top: 2%">\n' +
            '                        </div>');
        content = $("#messagecontentg"+theId).val();
        console.log(content,theId,id);
        stompClient.send("/message",{},JSON.stringify({
            content:content,
            toUserId:theId,
            fromUserId:id,
            time:getFormatDate(),
            userName:myName,
            messageType:"sendgroupmessage"
        }));
        $(".messageContentg"+theId).text(content);
        $(".timeg"+theId).text(getFormatDate());
        $("#messagecontentg"+theId).val("");
    }else{
        $("#message-content"+theId).append('<div style="width: 100%; height: auto;display: flex;flex-direction: row;justify-content: space-between;margin-bottom: 2%">\n' +
            '                            <textarea  readonly="readonly" style="width: 70%;margin-left: 17%;margin-top:3%;border-radius: 5px" class="ui-input-text ui-shadow-inset ui-body-inherit ui-corner-all ui-textinput-autogrow">'+$("#messagecontent"+theId).val()+'</textarea>\n' +
            '                            <img src='+myPicture+' style="width: 10%;height: 10%;border-radius: 50%;margin-top: 2%">\n' +
            '                        </div>');
        content = $("#messagecontent"+theId).val();

        console.log(content,theId,id);
        stompClient.send("/message",{},JSON.stringify({
            content:content,
            toUserId:theId,
            fromUserId:id,
            time:getFormatDate(),
            userName:myName,
            messageType:"sendmessage"
        }));
        $(".messageContent"+theId).text(content);
        $(".time"+theId).text(getFormatDate());
        $("#messagecontent"+theId).val("");
    }
}

$("#addFriend").click(function () {
    var addId = $(".selectId").val();
    $.post("http://localhost:8081/addfriends",{otherSideId:addId,userId:id,userName:myName},function(data){
        console.log(data)
        $(".backmessage").html(data)

    });
});

function accessClick(myId) {
    myId = myId.substring(6);
    $(".remind-content"+myId).css({
        "display": "none",
    });
    $.post("http://localhost:8081/access",{otherSideId:Number(myId),userId:id},function(data){
        console.log(data)
    });
    $(".remind").css({
        "background-color": "#e6e6e6",
    });
}

function refuseClick(myId) {
    myId = myId.substring(6);
    $(".remind-content"+myId).css({
        "display": "none",
    });
    $(".remind").css({
        "background-color": "#e6e6e6",
    });
    $.post("http://localhost:8081/refuse",{otherSideId:Number(myId),userId:id},function(data){
        console.log(data)
    });
}

function determine(myId) {
    myId = myId.substring(9);
    $(".remind-content"+myId).css({
        "display": "none",
    });
    $(".remind").css({
        "background-color": "#e6e6e6",
    });
}

$("#buildGroup").click(function () {
    let chooseFriend = [];  //定义数组
    var select = document.getElementById("chooseFriends");
    for(i=0;i<select.length;i++){
        if(select.options[i].selected){
            chooseFriend.push(select[i].value);
        }
    }
    let groupN = $(".groupName").val();
    let pict = $(".groupPicture").val();
    console.log(chooseFriend)

    $.ajax({
        url: 'http://localhost:8081/buildgroup',
        data: {userId:id,userName:myName,groupName:groupN,groupPicture:pict,receId:chooseFriend},
        //data: _list,
        dataType: "json",
        type: "POST",
        traditional: true,  //使用该属性放置深度序列化
        success: function (data) {
            console.log(data);
            $("#firendlist").append('<a href="#sendmessagepageg'+data+'" data-role="button" class="ui-btn" data-transition="slide" style="width: 100%;margin: 0;padding-top:5px;padding-bottom:5px;padding-left:7px;height: 8%; border-bottom:1px solid #e6e6e6;background-color: white;display: flex;flex-direction: row">\n'+
                '<img src="'+pict+'" style="width: 11.3%;height: 100%;margin: 0;border-radius: 5px;">\n'+
                '<div class="message-part" style="width: 83%;height: 100%;margin-left: 2%;display: flex;flex-direction: row;flex-wrap: wrap">\n'+
                '<text class="friendsName1" style="width: 85%;height: 50%;text-align:left;font-family: 宋体">'+groupN+'</text>\n'+
                '<text class="timeg'+data+'" style="width: 15%;height: 50%;font-size: 10px;color: #b5bbbf"></text>\n'+
                '<text class="messageContentg'+data+'" style="width: 100%;height: 50%;padding-top:1.2%;text-align:left;font-family: 黑体;font-size: 16px;color: #aab0b4;font-weight: 200;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">暂无消息</text>\n'+
                '</div>\n'+
                '</a>');
            $(".main-body").append('<div data-role="page" id="sendmessagepageg'+data+'">\n'+
                '<div data-role="header" data-position="fixed" style="background-color: #e6e6e6;height: 6.6%;border-width:0">\n'+
                '<a href="#firstpage" class="ui-btn" data-transition="slide" data-direction="reverse" style="width: 6.5%; background-color: #e6e6e6;height: 66.32%;padding: 0;margin-top: 1%;border: 0"><img\n'+
                'src="/static/img/back.png"\n'+
                'style="width: 100%;height: 100%;margin: 0"></a>\n'+
                '<h1 style="font-size: 20px;margin-top: -1%;font-family: 宋体">'+groupN+'</h1>\n'+
                '</div>\n'+
                '<div data-role="main" id="message-contentg'+data+'" class="ui-content" style="padding-top:0;padding-bottom:0;padding-left: 2%;padding-right: 2% ">\n'+
                ' </div>\n'+
                '<div data-role="footer" data-position="fixed" style="display: flex; align-items: center;justify-content: space-around">\n'+
                '<div class="ui-content" style="padding: 0;margin-left: 2%;background-color: rgba(242,250,255,0);width: 80%;margin-right: 0;margin-top: 0;margin-bottom:0;border: 0;border-color: rgba(242,250,255,0)">\n'+
                '<input type="text" id="messagecontentg'+data+'" style="margin: 0;padding: 0;width: 100%">\n'+
                ' </div>\n'+
                '<div style="width: 12%;height:30px">\n'+
                '<button class="btn-send" id="g'+data+'" onclick="sendClick(this.id)" style="height: 100%;width: 100%;margin: 0;padding: 0">发 送</button>\n'+
                '</div>\n'+
                '</div>\n'+
                '</div>');
        }
    });

});

function accessInviteClick(myId) {
    myId = myId.substring(12);
    console.log(myId);
    $(".remind-contentg"+myId).css({
        "display": "none",
    });
    $(".remind").css({
        "background-color": "#e6e6e6",
    });
    $.post("http://localhost:8081/accessinvite",{userId:id,groupId:myId},function (data) {
         console.log("")
    })
}

function refuseInviteClick(myId) {
    myId = myId.substring(12);
    console.log(myId);
    $(".remind-contentg"+myId).css({
        "display": "none",
    });
    $(".remind").css({
        "background-color": "#e6e6e6",
    });
    $.post("http://localhost:8081/refuseinvite",{userId:id,groupId:myId,userName:myName})
}